<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ include file="top.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>mimall</title>
<link rel="stylesheet" type="text/css" href="css/common.css">
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/goodsList.js"></script>
<style type="text/css">
body {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

h2.kindname {
	margin: 0;
	font-size: 22px;
	font-weight: 200;
	line-height: 58px;
	color: #333;
}

div.goodsdisplay {
	width: 234px;
	height: 300px;
	border-radius: 2%;
	margin: 5px 2px;
	border: 1px solid red;
	text-align: center;
	display: inline-block;
	cursor: pointer;
}

div.goodsdisplay:hover {
	z-index: 2;
	-webkit-box-shadow: 0 15px 30px rgb(0 0 0/ 10%);
	box-shadow: 0 15px 30px rgb(0 0 0/ 10%);
	-webkit-transform: translate3d(0, -2px, 0);
	transform: translate3d(0, -2px, 0);
}

.hidden {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.name {
	text-align: center;
	margin: 0 10px;
	font-size: 14px;
	font-weight: 400;
	color: #333;
}

.comments {
	margin: 0 10px 10px;
	height: 18px;
	font-size: 12px;
	color: #b0b0b0;
}

.newprice {
	margin: 0 10px 10px;
	text-align: center;
	color: #ff6700;
}

.oldprice {
	margin-left: .2em;
	color: #b0b0b0;
	text-decoration: line-through;
	font-size: 12px;
}

.status {
	color: #b0b0b0;
	font-size: 12px;
	margin-left: 0.2em;
}
</style>
</head>
<body>
	<c:forEach items="${goodsCountsByKid}" var="entry">
		<div class="kindblock">
			<h2 class="kindname" kid="${entry.key}">${entry.value.kind_name}</h2>
		</div>
	</c:forEach>

	<script type="text/javascript">
jQuery(document).ready(function($) {
    refreach();
    // 给名称绑定一个链接
    $('h2.kindname').each( function(index, val) {
        kid = parseInt($(this).attr('kid'));
        // console.log(kid);
        $(this).css('cursor', 'pointer');
        $(this).bind('click', function(event) {
                window.open('http://localhost:8080/mimall/goodsListByKid.do?kid='+kid,'_self');
            });
        });

});
</script>
</body>
</html>